<script lang="ts" setup>
import * as echarts from 'echarts';
import { onMounted, onBeforeUnmount ,ref} from 'vue'

const day7Array=ref([])
//获取最近一周
const get7Day = () => {
    const today = new Date();
    for (let i = 6; i >= 0; i--) {
        const currentDate = new Date(today);
        currentDate.setDate(today.getDate() - i);
        const dateString = currentDate.toISOString().split('T')[0];
        day7Array.value.push(dateString);
    }
    console.log(day7Array.value)
}

const initDataVision = () => {
    var chartDom = document.getElementById('assetChange');
    var myChart = echarts.init(chartDom);
    var option;

    option = {
        title: {
            text: ''
        },
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                label: {
                    backgroundColor: '#6a7985'
                }
            }
        },
        legend: {
            data: ['门店总金额', '累计收入', '待结算金额']
        },
        toolbox: {
            feature: {
                saveAsImage: {}
            }
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: [
            {
                type: 'category',
                boundaryGap: false,
                data: ['2023-11-09', '2023-11-10', '2023-11-11', '2023-11-12', '2023-11-13', '2023-11-14', '2023-11-15']
            }
        ],
        yAxis: [
            {
                type: 'value'
            }
        ],
        series: [
            {
                name: '门店总金额',
                type: 'line',
                stack: 'Total',
                areaStyle: {},
                emphasis: {
                    focus: 'series'
                },
                data: [340, 310, 291, 368, 380, 560, 520]
                
            },
            {
                name: '累计收入',
                type: 'line',
                stack: 'Total',
                areaStyle: {},
                emphasis: {
                    focus: 'series'
                },
                data: [220, 182, 191, 234, 290, 330, 310]
            },
            {
                name: '待结算金额',
                type: 'line',
                stack: 'Total',
                areaStyle: {},
                emphasis: {
                    focus: 'series'
                },
                data: [120, 132, 101, 134, 90, 230, 210]
            },
            
        ]
    };
    // option.xAxis[0].data = day7Array.value;
    option && myChart.setOption(option);
}

onMounted(() => {
    initDataVision()
    get7Day()
})

</script>

<template>
    <div id="assetChange" style=";height:400px;"></div>
</template>


<style scoped></style>